<template>
  <div width="500px" append-to-body>
    <el-form label-position="left" label-width="100px" :model="configForm" ref="configForm" :rules="rules">
      <el-form-item label="新配置导入:" prop="fileUrl">
        <p-upload-file @uploadFile="uploadFile"/>
      </el-form-item>
      <el-form-item label="备注:" prop="remark">
        <el-col :span="12">
          <el-input
            type="textarea"
            :autosize="{ minRows: 2, maxRows: 6}"
            placeholder="请输入配置说明"
            v-model="configForm.remark">
          </el-input>
        </el-col>
      </el-form-item>

      <el-form-item label="废弃原因:" prop="disuseCause">
        <el-col :span="12">
          <el-input
            type="textarea"
            :autosize="{ minRows: 2, maxRows: 6}"
            placeholder="请输入配置说明"
            v-model="configForm.disuseCause">
          </el-input>
        </el-col>
      </el-form-item>
      <el-form-item >
        <el-button type="primary" @click="submit('configForm')" style="position: relative;left: 150px;">提交</el-button>
        <el-button @click="closeReplace" style="position: relative;left: 250px;">返回</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import { modConfig } from '@/api/config/config'
import pUploadFile from '@/components/uploadFile'
export default {
  name: 'replace',
  components: {
    pUploadFile
  },
  data () {
    return {
      configForm: {},
      rules: {
        remark: [
          {required: true, message: '新配置描述不能为空', trigger: 'blur'}
        ],
        disuseCause: [
          {required: true, message: '原配置废弃原因不能为空', trigger: 'blur'}
        ],
        fileInfo: [
          {required: true, message: '请至少上传一个文件', trigger: 'change'}
        ]
      },
      closeStatus: false
    }
  },
  props: ['version', 'configId'],
  created () {
    let user = localStorage.getItem('userInfo')
    console.log(JSON.parse(user).group[0])
    this.configForm.roleGroup = JSON.parse(user).group[0]
  },
  methods: {
    //  关闭替换页面
    closeReplace () {
      this.configForm = {}
      this.$emit('closeEdit', this.closeStatus)
    },
    submit (formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.configForm.configId = this.configId
          modConfig(this.configForm).then((res) => {
            if (res.code === 0) {
              this.$notify.info({'title': '提示', 'message': '替换数据保存成功，请进行下面步骤直到发布，完成替换'})
              this.$emit('closeEdit', this.closeStatus)
              this.$emit('showConfirmConfig', res.data)
            } else {
              this.$notify.error({'title': '提示', 'message': '替换配置失败'})
            }
          })
        } else {
          console.log('error submit!!')
          this.$notify.error({'title': '提示', 'message': '当前输入项有误，请认真核实'})
          return false
        }
      })
    },
    uploadFile (val) {
      this.configForm.fileInfo = val[0]
    }
  }
}
</script>
